/* 
 * 恋爱交友小程序全局样式变量
 * 此文件定义了应用中使用的所有设计变量
 * 在组件中使用: @import "~@/styles/variables.scss";
 */

// 颜色系统
// 主色调
$primary-color: #FF4791;
$primary-light: rgba(255, 71, 145, 0.1);
$bg-color: #F8F8F8;
$white: #FFFFFF;

// 文字颜色
$text-primary: #333333;
$text-secondary: #999999;
$text-light: #CCCCCC;

// 边框颜色
$border-color: #EEEEEE;
$border-dark: #DDDDDD;

// 功能色
$success-color: #07C160;
$warning-color: #FF9900;
$error-color: #FF4D4F;
$link-color: #576B95;

// 字体大小
$font-large: 36rpx;
$font-title: 32rpx;
$font-subtitle: 28rpx;
$font-normal: 26rpx;
$font-small: 24rpx;
$font-mini: 22rpx;

// 字重
$font-weight-light: 300;
$font-weight-normal: 400;
$font-weight-bold: 600;

// 间距
$spacing-large: 30rpx;
$spacing-medium: 20rpx;
$spacing-small: 10rpx;
$spacing-mini: 5rpx;

// 内边距
$padding-large: 30rpx;
$padding-medium: 20rpx;
$padding-small: 10rpx;

// 圆角
$radius-large: 16rpx;
$radius-medium: 8rpx;
$radius-small: 4rpx;
$radius-circle: 50%;

// 卡片按钮圆角
$button-radius: 40rpx;

// 阴影
$shadow-light: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
$shadow-medium: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
$shadow-dark: 0 8rpx 24rpx rgba(0, 0, 0, 0.12);

// 过渡动画
$transition-fast: all 0.2s ease;
$transition-normal: all 0.3s ease;
$transition-slow: all 0.5s ease;

// Z-index层级
$z-index-normal: 1;
$z-index-dropdown: 10;
$z-index-fixed: 100;
$z-index-modal: 1000;
$z-index-popup: 2000;

// 图标尺寸
$icon-large: 48rpx;
$icon-normal: 40rpx;
$icon-small: 32rpx;
$icon-mini: 24rpx;

// 头像尺寸
$avatar-large: 120rpx;
$avatar-medium: 80rpx;
$avatar-small: 60rpx;
$avatar-mini: 40rpx; 